<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<style type="text/css">
			.mui-content{width: 100%;box-shadow: none;background-color: #EFEFF4;}
			.content-item{background-color: #FFFFFF;width: 100%;padding: 3% 5%;color: black;}
			.content-item1{margin-top: 5%;}
            .hr-div{border-bottom: 1px solid #EAEAEA;}
            .showw{margin-top: 5%;}
            .mui-switch{float: right;margin-top: -1.2%;}
		</style>
	</head>

	<body>
		
		<header class="mui-bar mui-bar-nav" id="header">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">新消息提醒</h1>
		</header>
		
		<div class="mui-content content-item1">
		    <div class="content-item hr-div showw">
	        	<span id="">接收新消息提醒</span>
	        	<div class="mui-switch mui-switch-blue mui-switch-mini mui-active" id="mySwitch">
				  <div class="mui-switch-handle"></div>
				</div>
	        </div>
	        
	        <div class="content-item hr-div content-item1" id="voicediv">
	        	<span id="">声音</span>
	        	<div class="mui-switch mui-switch-blue mui-switch-mini mui-active">
				  <div class="mui-switch-handle"></div>
				</div>
	        </div>
	        
	        <div class="content-item hr-div" id="zhendongdiv">
	        	<span id="">振动</span>
	        	<div class="mui-switch mui-switch-blue mui-switch-mini mui-active">
				  <div class="mui-switch-handle"></div>
				</div>
	        </div>
	        
	        
		</div>
		
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/immersed.js" ></script>
		<script type="text/javascript">
			mui.init();
			mui.plusReady(function(){
				starbar();
				plus.navigator.setStatusBarStyle('dark');
			})
			
			var voice = document.getElementById('voicediv');
			var zhendong = document.getElementById('zhendongdiv');
			document.getElementById("mySwitch").addEventListener("toggle",function(event){
				  var areacol = document.getElementById('getarea');
				  if(event.detail.isActive){
		              voice.style.display = "";
					  zhendong.style.display  ="";
				  }else{
		              voice.style.display = "none";
					  zhendong.style.display  ="none"
				  }
				})
		</script>
	</body>

</html>